<template>
  <h1>下拉选框组件</h1>
  <!--设置选择框的大小，和选择框中的提示文字-->
  <el-select v-model="city" placeholder="请选择城市" style="width:50%;">
    <!--  label 是显示在选项框中的文字，value是提交给后台的值  -->
    <el-option label="长春" value="cc"></el-option>
    <el-option label="杭州" value="hz"></el-option>
    <el-option label="郑州" value="zz"></el-option>
    <el-option label="北京" value="bj"></el-option>
  </el-select>
  <h4>提交的值:{{city}}</h4>
</template>

<script setup>
import {ref} from "vue";
//在单引号里面添加value值的话，在选项框里面的就是value值，是默认选项
const city = ref('hz');
</script>

<style scoped>

</style>